<template>
  <div :class="[ wrapClass ,'dialog', 'flex-column']" v-if="showDialog">
    <div class="dialogHead flex-row">
      <div class="editServiceTitle">{{title}}<span class="fontGrey">{{desc}}</span></div>
      <i class="layui-icon layui-icon-close pointer" @click="closeDialog"></i>
    </div>
    <div class="dialogContent">
      <slot></slot>
    </div>
    <button class="layui-btn layui-btn-normal submitInfo" v-if="showBtn" @click="submit">确定</button>
    <slot name="buttons"></slot>
  </div>
</template>
<script>
export default {
  name: 'customDialog',
  data() {
    return {
      showDialog: true
    }
  },
  props: ['title', 'desc', 'wrapClass','showBtn', 'closeDialog'],
  methods: {
    openDialog() {
      this.showDialog = true
    },
    submit() {
      this.closeDialog()
      this.$emit('submit')
    },
  }
}
</script>
